<template>
  <div>
    <div class="page-card m-top">
      <div class="page-header">
        <div>
          <h3 class="page-title">
            {{ xmxx.examName }}
          </h3>
          <div class="header-info">
            <p><span>时间：</span>{{ xmxx.startTime }} - {{ xmxx.endTime }}</p>
            <p>
              <span>年级：</span>
              {{ selectDictLabel(dict.type.grade, xmxx.grade) }}
            </p>
            <p>
              <span>考试类型：</span
              >{{ selectDictLabel(dict.type.type, xmxx.examType) }}
            </p>
            <p>
              <span>考试模式：</span
              >{{ selectDictLabel(dict.type.mode, xmxx.projectMode) }}
              {{ xmxx.selectTypeName }}
            </p>
          </div>
        </div>
      </div>
      <el-table
        stripe
        border
        v-loading="loading"
        :data="tableData"
        style="width: 100%"
        @selection-change="handleSelectionChange"
        row-key="id"
      >
        <!-- <el-table-column
          type="selection"
          width="55"
          align="center"
          :reserve-selection="true"
        /> -->
        <el-table-column
          label="考试名称"
          align="center"
          prop="name"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="考试总分"
          align="center"
          prop="totalScore"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="学校数量"
          align="center"
          prop="schoolCount"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="班级数量"
          align="center"
          prop="classCount"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="学生数量"
          align="center"
          prop="examineeCount"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="缺考数量"
          align="center"
          prop="absenteeCount"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="成绩状态"
          align="center"
          :show-overflow-tooltip="true"
        >
          <template slot-scope="scope">
            {{
              scope.row.status == "1"
                ? "已发布"
                : scope.row.status == "0"
                ? "未发布"
                : scope.row.status == "2"
                ? "上报异常"
                : scope.row.status == "3"
                ? "上报中"
                : ""
            }}
          </template>
        </el-table-column>
        <el-table-column
          label="操作"
          align="center"
          class-name="small-padding fixed-width"
        >
          <template slot-scope="scope">
            <el-link
              type="primary"
              v-if="scope.row.status != '1'"
              @click="cjgl(scope.row.id)"
              >修改成绩</el-link
            >
          </template>
        </el-table-column>
      </el-table>
    </div>

    <div class="page-bottom">
      <div class="sel-box">
        <p>共 {{ total }} 项</p>
        <el-button
          type="primary"
          v-if="this.tableData.length > 0 && this.tableData[0].status == 0"
          @click="plfb"
          >发布</el-button
        >
        <el-button
          type="danger"
          v-if="this.tableData.length > 0 && this.tableData[0].status == 1"
          @click="qxfb"
          >取消发布</el-button
        >
        <el-button
          type="danger"
          v-if="this.tableData.length > 0 && this.tableData[0].status == 2"
          @click="fbyc"
          >发布异常</el-button
        >
        <el-button
          type="warning"
          v-if="this.tableData.length > 0 && this.tableData[0].status == 3"
          >发布中 {{ progress }}%</el-button
        >
        <el-button type="primary" @click="getList()">刷新</el-button>
      </div>
      <pagination
        v-show="total > 0"
        :total="total"
        :page.sync="queryParams.pageNum"
        :limit.sync="queryParams.pageSize"
        @pagination="getList"
      />
    </div>

    <el-dialog title="批量发布" :visible.sync="fbVisible">
      <!-- <h4 style="margin-top: 0;color:#D54941">请确认学校管理内查询权限！</h4> -->
      <h4 style="margin-top: 0">设置查询角色与查询权限</h4>
      <el-form :model="fbForm" label-width="auto">
        <el-form-item label="限制角色">
          <el-switch
            v-model="fbForm.limit"
            active-color="#1890ff"
            active-value="1"
            inactive-value="0"
            style="margin-right: 40px"
          >
          </el-switch>
          <el-checkbox-group
            style="display: inline-block"
            v-model="checked"
            :disabled="fbForm.limit != '1'"
            :min="1"
          >
            <el-checkbox
              v-for="v in roleList"
              :key="v.roleId"
              :label="v.roleId"
              >{{ v.roleName }}</el-checkbox
            >
          </el-checkbox-group>
        </el-form-item>
        <!-- <el-form-item label="考生查询">
          <el-switch
            v-model="fbForm.studentView"
            active-color="#1890ff"
            active-value="1"
            inactive-value="0"
          >
          </el-switch>
        </el-form-item> -->
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="fbVisible = false">取 消</el-button>
        <el-button type="primary" @click="qrfb">确认发布</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  systemScoreManageStatistics,
  systemScoreManageScorePublish,
  scoreProgress,
} from "@/api/xmgl/cjgl";
import { listRole } from "@/api/system/role";
import { templatemenulist } from "@/api/xmgl/pyjsgl";
import { checkPassword } from "@/api/common";
export default {
  name: "cjfx",
  props: {
    xmxx: null,
  },
  dicts: ["grade", "type", "mode"],
  data() {
    return {
      loading: false,
      menuId: 2220,
      ids: [],
      total: 0,
      tableData: [],

      multiple: true,

      queryParams: {
        pageNum: 1,
        pageSize: 15,
      },

      roleList: [],
      checked: [],
      fbVisible: false,
      fbForm: {
        limit: "0",
        studentView: "1",
      },

      progress: 0,
      timer: null,
    };
  },
  created() {
    this.getList();

    listRole({ pageNum: 1, pageSize: 9999 }).then((res) => {
      let roleList = res.rows.filter((item) => {
        return item.roleKey.indexOf("reviewing:teachers:") != -1;
      });
      this.roleList = roleList;

      this.checked = roleList.map((item) => {
        return item.roleId;
      });
    });
  },
  methods: {
    getList() {
      // this.endTime();
      this.loading = true;
      this.tableData = [];
      systemScoreManageStatistics({ ...this.queryParams, examId: this.xmxx.id })
        .then((response) => {
          this.tableData = response.rows;
          this.total = response.total;

          // if (this.tableData.length > 0 && this.tableData[0].status == 3) {
          //   this.scoreProgress();
          //   this.startTime();
          // }
        })
        .finally(() => {
          this.loading = false;
        });
    },

    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.id);
      this.multiple = !selection.length;
    },

    plfb() {
      this.fbVisible = true;
    },
    qrfb() {
      this.loading = true;
      templatemenulist({ examId: this.xmxx.id })
        .then((res) => {
          let data = this.checked.map((item) => {
            return {
              roleId: item,
              menuId: this.menuId,
              examId: this.xmxx.id,
            };
          });
          data = data.concat(res.rows);

          systemScoreManageScorePublish({
            examId: this.xmxx.id,
            studentView: this.fbForm.studentView,
            status: 1,
            examRoleMenus: data,
          })
            .then((res) => {
              this.$modal.msgSuccess("操作成功");
              this.getList();
              this.fbVisible = false;
            })
            .catch(() => {
              this.loading = false;
            });
        })
        .catch(() => {
          this.loading = false;
        });
    },

    qxfb() {
      this.$prompt(
        "除拥有成绩管理权限的用户外，其他用户不能查询成绩和分析数据",
        "取消发布成绩",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          inputPlaceholder: "请输入管理员密码",
          inputType: "password",
          inputValidator: (value) => {
            if (!value) {
              return "请输入密码";
            } else {
              return true;
            }
          },
        }
      )
        .then(({ value }) => {
          this.loading = true;
          checkPassword({
            password: value,
            schoolId: this.$store.state.user.deptId,
          })
            .then((res) => {
              systemScoreManageScorePublish({
                examId: this.xmxx.id,
                studentView: 1,
                status: 0,
              })
                .then((res) => {
                  this.$modal.msgSuccess("操作成功");
                  this.getList();
                  this.fbVisible = false;
                })
                .catch(() => {
                  this.loading = false;
                });
            })
            .catch(() => {
              this.loading = false;
            });
        })
        .catch(() => {});
    },

    fbyc() {
      this.$modal.alertError("发布数据异常，请联系管理员");
    },

    // startTime() {
    //   this.timer = setInterval(() => {
    //     this.scoreProgress();
    //   }, 5000);
    // },
    // scoreProgress() {
    //   scoreProgress({
    //     examId: this.xmxx.id,
    //   })
    //     .then((res) => {
    //       if (res.data != 100) {
    //         this.progress = res.data;
    //       } else {
    //         this.getList();
    //       }
    //     })
    //     .catch(() => {
    //       this.getList();
    //     });
    // },
    // endTime() {
    //   this.progress = 0;
    //   clearInterval(this.timer);
    //   this.timer = null;
    // },
    cjgl(id) {
      this.$store.dispatch("app/setIsRefresh", true).then((res) => {
        this.$router.push({
          path: "/cjgl/cjgl",
          query: {
            examSubjectId: id,
          },
        });
      });
    },
  },
  // beforeDestroy() {
  //   if (this.timer) {
  //     this.endTime();
  //   }
  // },
};
</script>
<style lang="scss" scoped>
.page-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;

  .header-info {
    display: flex;
    align-items: center;

    p {
      padding: 0 15px;
      border-left: 1px solid #ddd;

      &:first-child {
        padding-left: 0;
        border-left: none;
      }

      span {
        color: rgb(144, 147, 153);
      }
    }
  }
}
</style>